<%@ include file="/common/taglibs.jsp"%>

<page:applyDecorator name="default">
<head>
    <title><fmt:message key="complaint.message"/></title>
    <meta name="heading" content="<fmt:message key='complaint.message'/>"/>
</head>

<spring:bind path="complaint.*">
    <c:if test="${not empty status.errorMessages}">
    <div class="error">
        <c:forEach var="error" items="${status.errorMessages}">
            <img src="<c:url value="/images/iconWarning.gif"/>"
                alt="<fmt:message key="icon.warning"/>" class="icon"/>
            <c:out value="${error}" escapeXml="false"/><br />
        </c:forEach>
    </div>
    </c:if>
</spring:bind>

<div class="separator"></div>

<form:form commandName="complaint" method="post" action="complaintform.html" onsubmit="return onFormSubmit(this)" id="complaintForm">
<form:hidden path="id" />

        <%-- So the buttons can be used at the bottom of the form --%>
        <c:set var="buttons">
		    <input type="submit" class="button" name="save" value="<fmt:message key="button.done"/>"/>
  			<input type="submit" class="button" name="_cancel" value="<fmt:message key="button.cancel"/>"/>
  		</c:set>
    <fmt:message key="complaint.message"/>

<div class="separator"></div>

<ul class="glassList">
    <li>
        <appfuse:label styleClass="desc" key="complaint.text"/>
	    <form:errors path="complaintText" cssClass="fieldError"/>
	    <form:textarea rows="8" cols="50" path="complaintText" id="complaintText"/>
	</li>
	<li>  
		<form:errors path="initialComplaint.businessName" cssClass="fieldError"/>
		<appfuse:label styleClass="desc" key="business.name"/>
    	<form:input path="initialComplaint.businessName" id="initialComplaint.businessName"/>
	</li>
	<li>
		<appfuse:label styleClass="desc" key="business.type"/>
	    <appfuse:businesscategory name="initialComplaint.businessCategoryId" prompt="" default="${initialComplaint.businessCategoryId}"/>
	</li>
	<li>
		<form:errors path="initialComplaint.address.address1" cssClass="fieldError"/>
		<appfuse:label styleClass="desc" key="business.address"/>
  		<form:input path="initialComplaint.address.address1" id="initialComplaint.address.address1"/>
	</li>
	<li>
		<appfuse:label styleClass="desc" key="business.address2"/>
    	<form:errors path="initialComplaint.address.address2" cssClass="fieldError"/>
  		<form:input path="initialComplaint.address.address2" id="initialComplaint.address.address2"/>
	</li>
	<li>    
		<appfuse:label styleClass="desc" key="business.city"/>		   
		<form:errors path="initialComplaint.address.city" cssClass="fieldError"/>
    	<form:input path="initialComplaint.address.city" id="initialComplaint.address.city"/>
	</li>
	<li>
		<appfuse:label styleClass="desc" key="user.address.county"/>
        <appfuse:county name="initialComplaint.address.countyId" prompt="" default="${initialComplaint.address.countyId}"/>
	</li>
	<li>
		<appfuse:label styleClass="desc" key="user.address.country"/>
		<redside:country name="address.country" prompt="" default="${user.address.country}"/>
	</li>
	<li>
		<appfuse:label styleClass="desc" key="business.zip"/>
    	<form:errors path="initialComplaint.address.postalCode" cssClass="fieldError"/>
    	<form:input path="initialComplaint.address.postalCode" id="initialComplaint.address.postalCode" maxlength="5"/>
	</li>
	<li>   
    	<appfuse:label styleClass="desc" key="business.phone"/>
    	<form:input path="initialComplaint.businessPhone" id="businessPhone" onblur="return formatPhone(this);"/>
    </li>
	<li>
    	<appfuse:label styleClass="desc" key="business.phone.ext"/>
    	<form:input path="initialComplaint.businessPhoneExt" id="businessPhoneExt" size="5" maxlength="5"/>
	</li>
	<li class="buttonBar right">
		<c:out value="${buttons}" escapeXml="false"/>
	</li>
</form:form>
<script type="text/javascript">
    Form.focusFirstElement($('complaintForm'));
    highlightFormElements();
</script>

</page:applyDecorator>